<template>
  <view class="container">
    <view class="form-item-wrap" v-if="!!props.info?.title">
      <view class="form-label">活动名称</view>
      <text class="form-item" selectable user-select>
        {{ props.info.title }}
      </text>
    </view>
    <view class="form-item-wrap" @click="callKefu" v-if="!!props.info?.mobile">
      <view class="form-label">客服热线</view>
      <text class="form-item" selectable user-select>
        {{ props.info.mobile }}
      </text>
    </view>
    <view class="form-item-wrap" v-if="!!props.info?.email">
      <view class="form-label">电子邮箱</view>
      <text class="form-item" selectable user-select>
        {{ props.info.email }}
      </text>
    </view>
    <view class="form-item-wrap" v-if="!!props.info?.worktime">
      <view class="form-label">客服服务时间</view>
      <text class="form-item" selectable user-select>
        {{ props.info.worktime }}
      </text>
    </view>
    <view class="form-item-wrap" v-if="!!props.info?.qrcode">
      <view class="form-label">客服微信</view>
      <view class="form-item">
        <view class="a_wechat" @click="kf_ercode">
          <image :src="props.info?.qrcode" style="width: 140rpx;height: 140rpx;"></image>
        </view>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
const props = defineProps({
  info: {
    type: Object,
    default: () => ({}),
  },
});

const callKefu = () => {
  if (!!props.info?.mobile) {
    uni.makePhoneCall({
      phoneNumber: props.info.mobile,
    });
  }
};
// 显示客户二维码
function kf_ercode() {
  uni.previewImage({
    current: props.info?.qrcode,
    urls: [props.info?.qrcode],
  });
}
</script>

<style lang="scss" scoped>
.container {
  padding: 20rpx;
  box-sizing: border-box;
  // 报名信息
  .form-item-wrap {
    .form-label {
      height: 36px;
      line-height: 36px;
      padding-bottom: 10px;
      font-size: 14px;
      color: #606266;
    }
    .form-item {
      display: block;
      background: white;
      border-radius: 10rpx;
      padding: 30rpx 20rpx;
    }
  }
}
</style>
